<template>
    <a-page-header
        :ghost="false"
        main>
        <template #title>
            <span v-if="!spinning">{{ `单位：${baseInfo.name}` }}</span>
        </template>

        <template #extra>
            <a-space>
                <a-button @click="downloadFile">导出</a-button>
                <!-- <a-button @click="goReport">报告</a-button> -->
                <a-button
                    @click="goback"
                    type="primary"
                    >返回</a-button
                >
            </a-space>
        </template>
        <a-row
            align="middle"
            type="flex">
            <a-col flex="1">
                <a-skeleton
                    v-if="spinning"
                    active />
                <a-descriptions
                    v-else
                    style="margin-top: 24px"
                    :column="3"
                    :labelStyle="{ color: 'rgba(0, 0, 0, 0.45)', fontSize: '14px', lineHeight: '24px' }">
                    <a-descriptions-item label="社会信用代码"> {{ baseInfo.creditCode }} </a-descriptions-item>
                    <!-- <a-descriptions-item label="行业">{{ baseInfo.industry }}</a-descriptions-item> -->
                    <!-- <a-descriptions-item label="行业代码">{{ baseInfo.industryCode }}</a-descriptions-item> -->
                    <a-descriptions-item :label="dataType[curIndustry[`list_${curDetail.at(-1)}`].type]">{{
                        baseInfo[tableIndex == 0 ? 'year' : 'period']
                    }}</a-descriptions-item>
                    <a-descriptions-item label="负责人">{{ baseInfo.charger }}</a-descriptions-item>
                    <a-descriptions-item label="填报人">{{ baseInfo.informant }}</a-descriptions-item>
                    <a-descriptions-item label="联系电话"
                        ><a>{{ baseInfo.mobile }}</a></a-descriptions-item
                    >
                    <a-descriptions-item label="报出日期">{{ baseInfo.date }}</a-descriptions-item>
                </a-descriptions>
                <a-skeleton
                    v-if="spinning"
                    :paragraph="{ rows: 12 }"
                    active />
                <DetailItem
                    v-else
                    :item="getDetailItems()"
                    :columnItems="curIndustry[curDetail.includes('0') ? 'list_0' : 'list_1'].detailColumn" />
            </a-col>
        </a-row>
    </a-page-header>
</template>

<script setup>
import { computed, onActivated, ref, onMounted } from 'vue'
import router from '@/router'
import { useRoute } from 'vue-router'
import { useThemeToken } from '@/hooks'
import DetailItem from './components/DetailItem.vue'
import apis from '@/apis'
import { config } from '@/config'
import { industryEnum, dataType } from '@/enums/industry'
import { useListStore } from '@/store'
defineOptions({
    name: 'profileAdvanced',
})
const spinning = ref(false)
const { token } = useThemeToken()
const listStore = useListStore()
const route = useRoute()
const curTable = route.path.split('/')[2]
const curDetail = route.path.split('/')[3]
const tableIndex = curTable.at(-1)
const curIndustry = industryEnum[curTable].children
const { getDetail: queryDetail } = tableIndex == 0 ? apis.list : apis.statement
const baseInfo = computed(() => listStore.getDetail[route.path] || {})
const getDetailItems = () => {
    if (tableIndex == 0) {
        return [baseInfo.value]
    } else {
        return baseInfo.value.moduleList || []
    }
}

async function getDetail(id) {
    spinning.value = true
    const { code, data } = await queryDetail[curDetail](id)
    if (config('http.code.success') === code) {
        listStore.setDetail({ [route.path]: data })
    }
    spinning.value = false
}
const goback = () => {
    router.back()
}
const downloadFile = () => {
    const link = document.createElement('a')
    const monthUrl = `${config('http.apiBasic')}/statement/month/${route.query.id}/download`
    const yearUrl = `${config('http.apiBasic')}/statement/${route.query.id}/download`
    link.href = curDetail.includes('0') ? yearUrl : monthUrl
    link.download = `${baseInfo.value.name}_企业报表文件`
    link.target = '_blank' // 可选，如果希望在新窗口中下载文件，请取消注释此行
    link.click()
}
onActivated(() => {
    if (baseInfo.value.id == route.query.id) {
        return
    }
    getDetail(route.query.id)
})

onMounted(() => {
    if (baseInfo.value.id == route.query.id) {
        return
    }
    getDetail(route.query.id)
})
</script>

<style lang="less" scoped>
.font {
    font-size: 13px;
    font-weight: 500;
}
</style>
